<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>登录</title>
		<link rel="stylesheet" type="text/css" href="../static/lib/layui/css/layui.css"/>
		<link rel="stylesheet" type="text/css" href="../static/css/public.css"/>
		<script src="../static/lib/layui/layui.js" type="text/javascript" charset="utf-8"></script>
	</head>
	<body>
		<div style="margin-top: 100px;">
			<h1>用户登录</h1>
			<div class="login-form">
				<form class="layui-form">
					<div class="layui-form-item">
					    <label class="layui-form-label"><i class="layui-icon layui-icon-username" style="font-size: 25px;"></i></label>
					    <div class="layui-input-block">
					      <input type="text" id="userName" name="userName" required  lay-verify="required" placeholder="请输入用户名" autocomplete="off" class="layui-input">
					    </div>
					</div>
					<div class="layui-form-item">
					    <label class="layui-form-label"><i class="layui-icon layui-icon-key" style="font-size: 25px;"></i></label>
						
					    <div class="layui-input-block">
					      <input type="password" id="password" name="password" required lay-verify="required" placeholder="请输入密码" autocomplete="off" class="layui-input">
					    </div>
					</div>
					<div class="layui-form-item">
					    <div class="layui-input-block" >
							<button class="layui-btn" lay-submit lay-filter="login-btn" style="width: 100%;">立即登录</button>
							<p style="margin-top: 10px;float: left;"><a href="">前往注册</a></p>
							<p style="margin-top: 10px;float: right;"><a href="">后台登录</a></p>
					    </div>
					</div>
				</form>
			</div>
			
		</div>
		<script>

		layui.use('form', function(){
		  var form = layui.form;
		  
		  //监听提交
		  form.on('submit(login-btn)', function(data){
		    layer.msg(JSON.stringify(data.field));
		    return false; 
		  });
		});
		</script>
	</body>
</html>
